<!DOCTYPE html>
<html>
	<head>
		<meta charset="utf-8">
		<title></title>
	</head>
	<body>
		<h3>JavaScript访问DOM树案例</h3>
		
		<a href="http://www.taobao.com"target="_blank">淘宝</a>
		<a class="jd"href="http://www.jd.com"target="_blank">京东</a>
		<a name="pdd"href="http://www.pinduoduo.com"target="_blank">拼多多</a>
		<a id="cgb"href="http://act.codeboy.com/"target="_blank">Java培优</a>
		
		<script>
			//window.alert('使用js获取页面元素内容');<!-- BOM中提供的弹出框api -->	
			// 获取页面a标签,按tagName方式返回是一个数组
			//第一种方式：tagname方法
			console.log(document.getElementsByTagName("a")[0].innerText);//a标签内容
			console.log(document.getElementsByTagName("a")[0].href);//a标签的href属性
			//第二种方法：classname方式
			console.log(document.getElementsByClassName("jd")[0].innerText);
			console.log(document.getElementsByClassName("jd")[0].href);
			//第三种方式：name方式
			console.log(document.getElementsByName("pdd")[0].innerText);
			console.log(document.getElementsByName("pdd")[0].href);
			//第四种方式：id方式,这种方式获得的就是一个值，无需数组方式
			console.log(document.getElementById("cgb").innerText);
			console.log(document.getElementById("cgb").href);
			
			var a=document.getElementsByTagName("a")[0];
			a.innerText="百度";
			a.href="http://www.baidu.com";
			console.log(document.getElementsByTagName("a")[0].innerText);//a标签内容
			console.log(document.getElementsByTagName("a")[0].href);//a标签的href属性
		</script>
	</body>
</html>
